import React from 'react';
import PropTypes from 'prop-types';
import BaseComponent from '../../components/common/baseComponent.js';
import { Coupon } from '../../models/coupon';
import { get, save } from '../../utils/storage';

class CouponCell extends BaseComponent {
  static propTypes = {
    coupon: PropTypes.instanceOf(Coupon).isRequired,
    type: PropTypes.oneOf(['pay', 'tmall', 'escort']),
    clickFunc: PropTypes.func,
  }

  static defaultProps = {
    type: 'pay',
  }

  clickCoupon = () => {
    const { clickFunc, coupon } = this.props;
    if (clickFunc) {
      clickFunc(coupon);
    }
  }

  goRefuel = (e) => {
    e.stopPropagation();
    const { type, coupon } = this.props;
    switch (type) {
      case 'tmall':
        this.props.history.push('/cq/home?withoutNav=true');
        break;
      case 'escort':
        let showAddInfo=get("showAddInfo");
        let toAddInfo=get("toAddInfo");
        if(!showAddInfo&&toAddInfo!==1){
          save('toAddInfo',1);
          this.props.history.push('addInsuranceInfo');
        }else{
        this.props.dispatch({
          type: 'code/preFetchCouponQRStatus',
          payload: {
            code: coupon.get('outCouponNo'),
            id: coupon.get('id'),
            escort:'escort'
          },
        });         
      }
        // this.props.history.push(`/escort/couponCode?couponCode=${coupon.get('outCouponNo')}&id=${coupon.get('id')}`);
        break;
      default:
        break;
    }
  }

  render() {
    const { coupon, type } = this.props;
    const disabled = !coupon.isActive() && type !== 'pay';
    let btn;
    if (!disabled) {
      btn = <div className="cell-btn" onClick={e => this.goRefuel(e)}>去加油</div>;
    }

    let statusView;
    if (disabled) {
      statusView = (
        <div className="status">
          <div className="text">{coupon.get('desc')}</div>
        </div>
      );
    }

    let textView;
    if (coupon.get('couponStatus') === 3) {
      textView = <p className="text">{coupon.getText()}<br />{coupon.getUseTime()}</p>;
    } else {
      textView = <p className="text">{coupon.getText()}</p>;
    }
    return (
      <div className={`coupon-cell ${disabled ? 'disabled' : ''}`} onClick={this.clickCoupon}>
        <div className="badge">{coupon.getBadge()}</div>
        <div className="cell-header">
          <div className="unit">&#65509;</div>
          <div className="money">{coupon.get('giftAmountYuan')}</div>
        </div>
        <div className="cell-body">
          <div className="title">{coupon.getTitle()}</div>
          {textView}
        </div>
        {btn}
        {statusView}
      </div>
    );
  }
}

export default CouponCell;
